import 'package:flutter/material.dart';

/// StatelessWidget 示例
/// 展示了几个常用的无状态组件的用法
class MyStatelessWidgetDemo extends StatelessWidget {
  const MyStatelessWidgetDemo({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('StatelessWidget Demo'),
        backgroundColor: Colors.blue,
      ),
      body: Center(
        child: Padding(
          padding: const EdgeInsets.all(16.0),
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            crossAxisAlignment: CrossAxisAlignment.center,
            children: [
              // 1. 简单的文本显示
              const Text(
                'Hello StatelessWidget!',
                style: TextStyle(
                  fontSize: 24,
                  fontWeight: FontWeight.bold,
                  color: Colors.blue,
                ),
              ),
              const SizedBox(height: 20),

              // 2. 图片显示
              Container(
                width: 150,
                height: 150,
                decoration: BoxDecoration(
                  color: Colors.grey[200],
                  borderRadius: BorderRadius.circular(10),
                ),
                child: const Icon(
                  Icons.image,
                  size: 50,
                  color: Colors.blue,
                ),
              ),
              const SizedBox(height: 20),

              // 3. 按钮示例
              ElevatedButton(
                onPressed: () {
                  // 显示一个简单的提示框
                  ScaffoldMessenger.of(context).showSnackBar(
                    const SnackBar(
                      content: Text('这是一个 StatelessWidget 按钮点击事件'),
                      duration: Duration(seconds: 2),
                    ),
                  );
                },
                style: ElevatedButton.styleFrom(
                  padding: const EdgeInsets.symmetric(
                    horizontal: 30,
                    vertical: 15,
                  ),
                ),
                child: const Text('点击我'),
              ),
              const SizedBox(height: 20),

              // 4. 卡片示例
              Card(
                elevation: 5,
                child: Padding(
                  padding: const EdgeInsets.all(16.0),
                  child: Column(
                    children: [
                      const Icon(
                        Icons.info,
                        color: Colors.blue,
                        size: 30,
                      ),
                      const SizedBox(height: 10),
                      const Text(
                        'StatelessWidget 特点',
                        style: TextStyle(
                          fontSize: 18,
                          fontWeight: FontWeight.bold,
                        ),
                      ),
                      const SizedBox(height: 10),
                      Text(
                        '1. 没有内部状态\n2. build 方法只运行一次\n3. 适合展示静态内容',
                        style: TextStyle(
                          color: Colors.grey[600],
                        ),
                      ),
                    ],
                  ),
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}